// load all ui components (as the constructors will be called by the browser)

import '@dom-native/ui';
import { defaultIcons } from '@dom-native/ui';
import { trigger } from 'dom-native';
import { webGet } from './web-request';

// Load default icon set as <svg><symbol>..</svg> doc in the html head. 
defaultIcons.load();
/**
 * This module finish loading all of the assets (i.e. svg symbols) and triggers as "APP_LOADED". The APP_LOADED event will be listened in the 
 * main.js (or test-main.js) to start the application.
 *
 * We put it on DOMContentLoader (i.e. $.ready for modern browsers) to make sure it is run after all js are loade
 **/

// --------- Load svg icons --------- //
// NOTE: We start the loading as soon as possible (before the DOMContentLoaded)
const svgSymbolsPromise = webGet("/svg/sprite.svg", { contentType: "application/xml" });
// --------- /Load svg icons --------- //	

document.addEventListener("DOMContentLoaded", function (event) {
	// we make sure the the ajax for the svg/sprites.svg returns
	svgSymbolsPromise.then(function (xmlDoc) {
		// add the symbols to the head (external linking works but has issues - styling, and caching -)
		const firstChildElement = xmlDoc.firstChildElement || xmlDoc.childNodes[0]; // edge does not seem to have .firstChildElement, at least for xlmDoc
		const h = document.querySelector("head");
		if (h != null)
			h.appendChild(firstChildElement);

		// trigger an event that the application has been loaded
		trigger(document, "APP_LOADED");

	});
});
